<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script type="text/javascript">

$(document).ready(function(){
	var pageNo=1;
	//comment 저장버튼을 누를시 동작
	$("#freeComBtn").click(function(){
		$.ajax({
			url: "freeboard.do?command=freeBoardCommentRegister",
			type:"post",
			data: "comId=${sessionScope.userInfo.id}&comf=${requestScope.freeboard.fbvo.no}&content="+$("#freeComment").val(),
			dataType: "json",
			success:function(jsonData){
				var temp=createTable(jsonData.commentList);
 	 				//컨트롤러에서 받아온 데이터를 freeCommentView에 뿌려준다.
 					$("#freeCommentView").html(temp);
 					//comment 창 초기화
 					$("#freeComment").val("");
 					//현재 웹페이지 새로고침
 					location.reload(true);
			}//success
		}); // ajax
	});//click
	// document.ready   수정 버튼을 누를시 동작
	$("button[name=commentUpdate]").click(function(){
		if(confirm("업데이트 하겠습니까??")){
			//alert($(this).val());
			location.href="freeboard.do?command=freeBoardCommentUpdateView&no="+$(this).val();
		} //if
	});
	// document.ready 삭제 버튼을 누를시 동작
	$("button[name=commentDelete]").click(function(){
		// comment sequance;
		var commentNo = $(this).val();
		// comment Page
		var nowPage = pageNo;
		//comment sequance 와 comment가 있는 페이지 번호를 넘기면 ajax로 comment삭제시키고 해당페이지 comment리스트를 가져온다.
		deleteConfirm(commentNo, nowPage);
	}); //delete button event
	$("button[name=commentPagingBtn]").click(function(){
		//페이징 번호를 클릭할때 전역변수에 pageNo값을 저장한다.
		boardNo = ${requestScope.freeboard.fbvo.no};
		pageNo = $(this).val();
		location.href="freeboard.do?command=freeBoardShowContent&no="+boardNo+"&page="+pageNo;
	});
});//document


//document.ready 이후 만들어진 recommentDelete 버튼을 사용할수 있다.
$(document).on("click","button[name=recommentDelete]",function(){
	// comment sequance;
	var commentNo = $(this).val();
	// comment Page
	var nowPage = pageNo;
	//comment sequance 와 comment가 있는 페이지 번호를 넘기면 ajax로 comment삭제시키고 해당페이지 comment리스트를 가져온다.
	deleteConfirm(commentNo, nowPage);

});
//document.ready 이후 만들어진 recommentUpdate 버튼을 사용할수 있다.
$(document).on("click","button[name=recommentUpdate]",function(){
	if(confirm("업데이트 하겠습니까??")){
		//alert($(this).val());
		location.href="freeboard.do?command=freeBoardCommentUpdateView&no="+$(this).val();
	} //if
});
//리스트값으로 덧글 테이블을 만든다.
function createTable(dataList){
	var userId = "${sessionScope.userInfo.id}";

	var temp="<hr color='blue' width='800'>";
		$.each(dataList, function(index, list){
			temp+=
			//"<hr color='blue' width='800'>"+ 
			"<div><table align='center' width='800' height='120'>"+
			"<tr><td align='left' width='710'>"+
			"<b>"+
			list.id+
			"</b>"+
			"<br>"+
			"<br>"+
			"<font size='2'>"+
			list.content+
			"</font>"+
			"</td><td width='90'>"+
			list.time_posted+
			"<br>"; 
				 if((list.id=="${sessionScope.userInfo.id}") || "(${sessionScope.userInfo.grade == 'admin'})"){
					temp +=
						"<br>"+
						"<button type='button' name='recommentUpdate' value="+list.no+">수정</button>"+
						"<br>"+
						"<button type='button' name='recommentDelete' value="+list.no+">삭제</button>"
				 }
			temp+="</td></tr></table></div><br>"+
			"<hr color='blue' width='800'>";
		});
		return temp;
} //createTable 
//comment sequance 와 comment가 있는 페이지 번호를 넘기면 ajax로 comment삭제시키고 해당페이지 comment리스트를 가져온다.
function deleteConfirm(commentNo, nowPage){
	if(confirm("삭제하시겠습니까??")){
		var no = ${requestScope.freeboard.fbvo.no};
			var url = "freeboard.do?command=freeBoardCommentDelete&page="+nowPage+"&no="+ commentNo+"&boardNo="+no;
			location.href= url;
	} //if
}
</script>

	<c:set value="${requestScope.freeboard.fbvo}" var="fbvo"></c:set>
	<h1 align="center">상세 게시판</h1>
	<table border="0" bordercolor="black" cellspacing="0" cellpadding="0" style="border-style:solid;" width="800" align="center" >
		<hr width="800">
		<tr>
			<td width="8%" >제목: </td>
			<td><b>${fbvo.title}</b></td>
		</tr>
		<tr>
			<td width="8%">이름: </td>
			<td>${fbvo.id}</td>
		</tr>
		<tr>
			<td width="8%">등록일: </td>
			<td>${fbvo.time_posted}</td>
		</tr>
		<tr>
			<td width="8%">조회수: </td>
			<td>${fbvo.hits}</td>
		</tr>
		<tr>
			<td width="800" height="400" colspan="2">
			<textarea style="width: 99.3%; height: 100%; resize:none;" cols="130" readonly="readonly">${fbvo.content}</textarea>
			</td>
		</tr>
	</table>
	<center>
		<br>
		<!--  -->
		&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<%-- 세션 아이디와 리퀘스트 아이디가 같다면 삭제 , 수정 버튼을 사용할수있다.--%>
		
		<c:if test="${(fbvo.id==sessionScope.userInfo.id) || (sessionScope.userInfo.grade == 'admin')}">
			<a href="freeboard.do?command=freeBoardReplyView&no=${fbvo.no}">답글</a>
			<a href="freeboard.do?command=freeBoardDelete&no=${fbvo.no}">삭제</a>
			<a href="freeboard.do?command=freeBoardupdateView&no=${fbvo.no}">수정</a>
		</c:if>
		<a href="freeboard.do?command=freeBoardGetAllList">목록보기</a>

		<hr color="blue" width="800">
		
		댓글 read 영역
		
		</center>
		<div id="freeCommentView">
		 <c:forEach items="${requestScope.freeboard.list}" var="list">
			<hr color="blue" width="800">
				<div><table align="center" width="800" height="120" >
				<tr>
				<td width="710">아이디:<b>${list.id}</b><br><br>
				<font size="2" >
				${list.content}
				</font>
				</td>
				<td width="90">
				${list.time_posted}<br>
				<c:if test="${(list.id==sessionScope.userInfo.id) || (sessionScope.userInfo.grade == 'admin')}">
				<br>
				<button type="button" name="commentUpdate" value="${list.no}">수정</button>
				<button type="button" name="commentDelete" value="${list.no}">삭제</button>
				</c:if>
				 </td></tr></table></div>
				<hr color='blue' width='800'>
			</c:forEach>
		</div>

		<%-- 덧글 write영역--%>
	<c:set value="${requestScope.freeboard.pagingBean}" var="pb"></c:set>
	<div>
	<center>
	<%-- 페이지 이전 버튼 --%>
<c:if test="${pb.previousPageGroup}">
<a href="freeboard.do?command=freeBoardShowContent&no=${fbvo.no}&page=${pb.startPageOfPageGroup-1}"><img src="./img/left_arrow_btn.gif"></a>
</c:if>
<%--<button name="commentPagingBtn" value="${fList}" >${fList }</button> --%>
<%--페이지 버튼 --%>
	<c:forEach begin="${pb.startPageOfPageGroup}" end="${pb.endPageOfPageGroup}" var="fList">
		<c:choose>
			<c:when test="${pb.nowPage!=fList }">
			<button name="commentPagingBtn" value="${fList}" >${fList }</button>
				<%-- <a  href="freeboard.do?command=freeBoardShowContent&no=${fbvo.no}&page=${fList}" >${fList}</a> --%>
			</c:when>
			<c:otherwise>
				 <b><font color="red">${fList}</font></b>
			</c:otherwise>
		</c:choose>
			
	</c:forEach>
	<%-- 페이지 다음 버튼 --%>
<c:if test="${pb.nextPageGroup}">
<a href="freeboard.do?command=freeBoardShowContent&no=${fbvo.no}&page=${pb.endPageOfPageGroup+1 }"><img src="./img/right_arrow_btn.gif"></a>
</c:if>
	</center>
	</div>	
	<br><br>
	<c:if
		test="${sessionScope.userInfo.id != null || sessionScope.userInfo != null}">
		<center>
			상대에게 상처를 주기보다 같이 즐거워할 수 있는 코멘트를!!!<br> <font color="red">심한
				욕설및 인격모독성 발언은 제재하도록 하겠습니다.</font><br>

			<textarea id="freeComment" rows="6" cols="110" placeholder="댓글 입력창"></textarea>
			<br>
			&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<input type="button" id="freeComBtn" value="저장">
	
	</c:if>
